<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pe="http://primefaces.org/ui/extensions">

<h:head>
	<h:outputStylesheet library="css" name="default.css" />
	<h:outputStylesheet library="css" name="imagens.css" />
</h:head>

<ui:composition template="#{proprietarioFaces.nomeTemplate}">

	<ui:define name="content">
		<h:form id="formProprietario">
			<p:growl id="mensagens" life="#{msg.time_stick}" />

			<p:panel id="painel" >
				<f:facet name="header">
					<div align="left"><h:outputText value="Proprietário" styleClass="tituloPainelInterno"/></div>
				</f:facet>
			
				<p:spacer height="2px" />
				
				<p:panel id="painelBusca" header="Pesquisar">
					<f:facet name="header">
						<div align="left"><h:outputText value="Pesquisar" styleClass="tituloPainelInterno"/></div>
					</f:facet>

					<h:outputText value="Nome " />
					<p:inputText value="#{proprietarioFaces.proprietarioBusca}" />
					
					<p:commandButton value="Buscar" id="buscaProprietario"
						actionListener="#{proprietarioFaces.buscarProprietario()}" 
							update=":formProprietario:tabelaProprietario" icon="imgPesquisaBasica"
							style="float:right"
							/>
					<p:tooltip value="Buscar proprietários" for="buscaProprietario" styleClass="textoToolTip"/>
				</p:panel>
				
				<p:spacer height="2px" />
				
				<p:dataTable value="#{proprietarioFaces.listaProprietario}" var="item" id="tabelaProprietario" 
					emptyMessage=" " styleClass="tabelaCompleta colunaLinhaUnica" 
					rowStyleClass="#{empty rowIx or rowIx mod 2 ne 0 ? 'even-row' : 'odd-row'}" rowIndexVar="rowIx"
					>
					
					<f:facet name="header">
						<div align="left"><h:outputText value="Proprietários" styleClass="tituloPainelInternoComBotao"/></div>
						<div align="right">
            				<p:commandButton value="Novo" id="novoProprietario" 
            					actionListener="#{proprietarioFaces.prepararAdicionar()}"  
								icon="imgAdicionar" update=":formProprietario:dialogProprietario"
							/>
							<p:tooltip value="Adicionar proprietário" for="novoProprietario" styleClass="textoToolTip"/>
						</div>
					</f:facet>
					
					<p:column headerText="Proprietário">
						<h:outputText value="#{item.nome}" />
					</p:column>

					<p:column headerText="Endereço">
						<h:outputText value="#{item.endereco}" />
					</p:column>

					<p:column headerText="E-mail">
						<h:outputText value="#{item.email}" />
					</p:column>

					<p:column headerText="Observações" >
						<h:outputText value="#{item.observacao}" id="obs"/>
						<p:tooltip for="obs" value="#{item.observacao}" styleClass="textoToolTip"/>
					</p:column>

					<p:column headerText="Opções" width="10%">
							<p:commandLink styleClass="ui-icon ui-icon-pencil" 
									actionListener="#{proprietarioFaces.selecionarRegistro(item.id, 'dialogProprietario')}"
									update=":formProprietario:dialogProprietario"
									title="Editar" style="float:left;"
									/>
	
							<p:commandLink styleClass="ui-icon ui-icon-close" 
									actionListener="#{proprietarioFaces.selecionarRegistro(item.id, 'dialogExcluir')}"
									update=":formProprietario:dialogExcluir"
									title="Excluir" style="float:left;"
									/>

							<p:commandLink styleClass="ui-icon ui-icon-folder-open" 
									actionListener="#{proprietarioFaces.selecionarRegistro(item.id, 'dialogTelefones')}"
									update=":formProprietario:dialogTelefones"
									title="Telefones" style="float:left;"
									/>

							<p:commandLink styleClass="ui-icon ui-icon-search" 
									actionListener="#{proprietarioFaces.selecionarRegistro(item.id, 'buscarAnimais')}"
									title="Animais" style="float:left;"
									/>

							<p:commandLink styleClass="ui-icon ui-icon-arrowstop-1-s" 
									actionListener="#{proprietarioFaces.selecionarNoDialog(item)}" rendered="#{proprietarioFaces.isPopup}" />
					</p:column>
					
				</p:dataTable>
			</p:panel>

			<p:dialog header="Campos Proprietario" widgetVar="dialogProprietario" id="dialogProprietario" 
					modal="true" resizable="false" closeOnEscape="true">
						
						<table>
							<tr>
								<td>
									<h:outputText value="Nome" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.nome}"/>
								
								</td>
								<td>
									<h:outputText value="Sexo" />
								</td>
								<td>
									<p:selectOneMenu value="#{proprietarioFaces.proprietario.sexo}">
										<f:selectItems value="#{proprietarioFaces.listaSexo}" var="sexo" 
											itemValue="#{sexo}" itemLabel="#{sexo.sexo}"/>
									</p:selectOneMenu>
								</td>
								<td>
									<h:outputText value="Endereço" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.endereco}"/>
								</td>
							</tr>
							<tr>
								<td>
									<h:outputText value="Número" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.numero}"/>
								</td>
								<td>
									<h:outputText value="Complemento" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.complemento}"/>
								</td>
								<td>
									<h:outputText value="Cep" />
								</td>
								<td>
									<p:inputMask mask="99999-999" value="#{proprietarioFaces.proprietario.cep}"/>
								</td>
							</tr>
							
							<tr>
								<td>
									<h:outputText value="Bairro" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.bairro}"/>
								</td>
								<td>
									<h:outputText value="Cidade" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.cidade}"/>
								</td>
								<td>
									<h:outputText value="UF" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.uf}"/>
								</td>
							</tr>
							
							<tr>
								<td>
									<h:outputText value="Tipo Proprietário" />
								</td>
								<td>
									<p:selectOneMenu value="#{proprietarioFaces.proprietario.tipoProprietario}">
										<f:selectItems value="#{proprietarioFaces.listaTipoProprietario}" var="tpProp" 
											itemValue="#{tpProp}" itemLabel="#{tpProp.tipoProprietario}"/>
											
										<p:ajax event="change" update="campoCnpj campoIE campoCpf"/>
									</p:selectOneMenu>
								</td>
								<td>
									<h:outputText value="CPF" />
								</td>
								<td>
									<p:inputMask mask="999.999.999-99" value="#{proprietarioFaces.proprietario.cpf}"
										disabled="#{proprietarioFaces.proprietario.tipoProprietario.tipoProprietario.equalsIgnoreCase('Jurídica')}"
										id="campoCpf"
									
									/>
								</td>
								<td>
									<h:outputText value="Cnpj" />
								</td>
								<td>
									<p:inputMask mask="99.999.999/9999-99" value="#{proprietarioFaces.proprietario.cnpj}"
										disabled="#{proprietarioFaces.proprietario.tipoProprietario.tipoProprietario.equalsIgnoreCase('Física')}"
										id="campoCnpj"
									/>
								</td>
							</tr>
							<tr>
								<td>
									<h:outputText value="E-mail" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.email}"/>
								</td>
								<td>
									<h:outputText value="Inscrição Estadual" />
								</td>
								<td>
									<p:inputText value="#{proprietarioFaces.proprietario.inscricaoEstadual}"
										disabled="#{proprietarioFaces.proprietario.tipoProprietario.tipoProprietario.equalsIgnoreCase('Física')}"
										id="campoIE"
									/>
								</td>
							</tr>
							<tr>
								<td>
									<h:outputText value="Observação" />
								</td>
								<td colspan="5">
									<p:inputTextarea id="textoComentario" rows="10" autoResize="true"
										value="#{proprietarioFaces.proprietario.observacao}" 
										style="width:99%;max-width:99%;height:100px;max-height:100px;" />
									
								</td>
							</tr>							
														
						</table>
						
						<h:panelGroup id="group">
						<p:dataTable  editable="true" value="#{proprietarioFaces.listaTelefones}" var="telefone" id="tabelaTel"
							emptyMessage="Nenhum telefone." paginator="true" paginatorAlwaysVisible="true"
								paginatorPosition="bottom" rows="4" 
								rowStyleClass="#{empty rowIx or rowIx mod 2 ne 0 ? 'even-row' : 'odd-row'}" rowIndexVar="rowIx"
								>
							<f:facet name="header">
								<div align="left">
									<h:outputText value="Telefones" styleClass="tituloPainelInternoComBotao" />
								</div>
								<div align="right">
									<p:commandButton value="Novo"
										actionListener="#{proprietarioFaces.adicionarTelefones()}" title="Adicionar Telefone"
										icon="imgAdicionar"
										update=":formProprietario:tabelaTel" />
								</div>
							</f:facet>					
							
							<p:column headerText="TipoTelefone">
								<p:selectOneMenu value="#{telefone.tipoTelefone}" >
									<f:selectItems value="#{proprietarioFaces.tiposTelefone}" var="tipo" itemLabel="#{tipo.tipoTelefone}"/>
									<p:ajax event="change" update=":formProprietario:group" />
								</p:selectOneMenu>
							</p:column>
							
							<p:column headerText="Número">
								<p:inputMask mask="(99) 9999-9999" value="#{telefone.numero}" id="telRes"
									rendered="#{!telefone.tipoTelefone.tipoTelefone.equalsIgnoreCase('Celular')}"/>
									
								<p:inputMask mask="(99) 99999-9999" value="#{telefone.numero}" id="telCel"
									rendered="#{telefone.tipoTelefone.tipoTelefone.equalsIgnoreCase('Celular')}"/>
							</p:column>
							
							<p:column headerText="Remover" width="5%">
								<p:commandLink actionListener="#{proprietarioFaces.removerTelefone(telefone)}" 
									update=":formProprietario:tabelaTel" styleClass="ui-icon ui-icon-minus"/>
							</p:column>
						</p:dataTable>
						</h:panelGroup>
						
						<div align="center">
							<p:commandButton value="Adicionar" actionListener="#{proprietarioFaces.adicionar()}" 
											title="Adicionar Proprietário" icon="imgAdicionar"
											update="mensagens :formProprietario:tabelaProprietario"
											rendered="#{proprietarioFaces.proprietario.id == null}"
							/>
							
							<p:commandButton value="Salvar" actionListener="#{proprietarioFaces.editar()}" 
											title="Editar Proprietário" icon="imgSalvar"
											update="mensagens :formProprietario:tabelaProprietario" 
											rendered="#{proprietarioFaces.proprietario.id != null}"
							/>
						</div>					
					
			</p:dialog>
			
			<p:dialog widgetVar="dialogExcluir" id="dialogExcluir" header="Confirmar Exclusão" 
					modal="true" resizable="false" closeOnEscape="true">
				<h:outputText value="Confirma a exclusão da Proprietário " /> 
				<br />
				<h:outputText value="#{proprietarioFaces.proprietario.nome} ?" />
				<br />
				<p:commandButton value="Excluir" actionListener="#{proprietarioFaces.remover()}" 
				update="mensagens :formProprietario:tabelaProprietario" />
			</p:dialog>
			
			<p:dialog widgetVar="dialogTelefones" id="dialogTelefones" 
					header="Telefones de #{proprietarioFaces.proprietario.nome}" width="30%" resizable="false" modal="true">
				<p:dataTable value="#{proprietarioFaces.listaTelefones}" var="item" emptyMessage="Nenhum telefone registrado."
					rowStyleClass="#{empty rowIx or rowIx mod 2 ne 0 ? 'even-row' : 'odd-row'}" rowIndexVar="rowIx"
				>
					<p:column headerText="Número">
						<h:outputText value="#{item.numero}" />
					</p:column>
					
					<p:column headerText="Tipo Telefone">
						<h:outputText value="#{item.tipoTelefone.tipoTelefone}" />
					</p:column>				

				</p:dataTable>
			</p:dialog>

		</h:form>
	</ui:define>
</ui:composition>
</html>